<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="">
  <meta name="author" content="Dashboard">
  <meta name="keyword" content="Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">
  <title>商城</title>

  <!-- Favicons -->
  <link href="list/img/favicon.png" rel="icon">
  <link href="list/img/apple-touch-icon.png" rel="apple-touch-icon">
  <!-- Bootstrap core CSS -->
  <link href="list/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  <!--external css-->
  <link href="list/lib/font-awesome/css/font-awesome.css" rel="stylesheet" />
  <link rel="stylesheet" type="text/css" href="list/css/zabuto_calendar.css">
  <link rel="stylesheet" type="text/css" href="list/lib/gritter/css/jquery.gritter.css" />
  <!-- Custom styles for this template -->
  <link href="list/css/style.css" rel="stylesheet">
  <link href="list/css/style-responsive.css" rel="stylesheet">
  <script src="list/lib/chart-master/Chart.js"></script>
  <!-- 局部刷新页面 -->
  <link rel="stylesheet" href="bower_components/Ionicons/css/ionicons.min.css">
  <link rel="stylesheet" href="dist/css/AdminLTE.min.css">
  <link rel="stylesheet" href="dist/css/skins/skin-blue.min.css">
  <link rel="stylesheet" href="bower_components/layer/skin/default/layer.css">
  <link rel="stylesheet" href="bower_components/ztree/css/metroStyle/metroStyle.css"/>
  <link rel="stylesheet" href="bower_components/treegrid/jquery.treegrid.css"/>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>




  <!-- =======================================================
    Template Name: Dashio
    Template URL: https://templatemag.com/dashio-bootstrap-admin-template/
    Author: TemplateMag.com
    License: https://templatemag.com/license/
  ======================================================= -->
</head>
<body>
<section id="container">
  <!-- **********************************************************************************************************************************************************
      TOP BAR CONTENT & NOTIFICATIONS
      *********************************************************************************************************************************************************** -->
  <!--header start-->
  <header class="header black-bg">
    <div class="sidebar-toggle-box">
      <div class="fa fa-bars tooltips" data-placement="right" data-original-title="Toggle Navigation"></div>
    </div>
    <!--logo start-->
    <a href="#" class="logo"><b>商城<span>后台管理系统</span></b></a>
    <!--logo end-->
    <div class="nav notify-row" id="top_menu">
      <!--  notification start -->
      <ul class="nav top-menu">
        <!-- settings start -->
        <li class="dropdown">
          <a data-toggle="dropdown" class="dropdown-toggle" href="#">
            <i class="fa fa-tasks"></i>
            <span class="badge bg-theme">4</span>
          </a>
          <ul class="dropdown-menu extended tasks-bar">
            <div class="notify-arrow notify-arrow-green"></div>
            <li>
              <p class="green">项目进度</p>
            </li>
            <li>
              <a href="#">
                <div class="task-info">
                  <div class="desc">商城管理面板</div>
                  <div class="percent">40%</div>
                </div>
                <div class="progress progress-striped">
                  <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="width: 40%">
                    <span class="sr-only">40% Complete (success)</span>
                  </div>
                </div>
              </a>
            </li>
            <li>
              <a href="#">
                <div class="task-info">
                  <div class="desc">数据库更新</div>
                  <div class="percent">60%</div>
                </div>
                <div class="progress progress-striped">
                  <div class="progress-bar progress-bar-warning" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%">
                    <span class="sr-only">60% Complete (warning)</span>
                  </div>
                </div>
              </a>
            </li>
            <li>
              <a href="#">
                <div class="task-info">
                  <div class="desc">产品开发</div>
                  <div class="percent">80%</div>
                </div>
                <div class="progress progress-striped">
                  <div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="100" style="width: 80%">
                    <span class="sr-only">80% Complete</span>
                  </div>
                </div>
              </a>
            </li>
            <li>
              <a href="#">
                <div class="task-info">
                  <div class="desc">付款送出</div>
                  <div class="percent">70%</div>
                </div>
                <div class="progress progress-striped">
                  <div class="progress-bar progress-bar-danger" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width: 70%">
                    <span class="sr-only">70% Complete (Important)</span>
                  </div>
                </div>
              </a>
            </li>
            <li class="external">
              <a href="#">查看所有任务</a>
            </li>
          </ul>
        </li>
        <!-- settings end -->
        <!-- inbox dropdown start-->
        <li id="header_inbox_bar" class="dropdown">
          <a data-toggle="dropdown" class="dropdown-toggle" href="#">
            <i class="fa fa-envelope-o"></i>
            <span class="badge bg-theme">5</span>
          </a>
          <ul class="dropdown-menu extended inbox">
            <div class="notify-arrow notify-arrow-green"></div>
            <li>
              <p class="green">您有五条新消息</p>
            </li>
            <li>
              <a href="#">
                <span class="photo"><img alt="avatar" src="list/img/002.jpg"></span>
                <span class="subject">
                  <span class="from">马云</span>
                  <span class="time">Just now</span>
                  </span>
                <span class="message">
                  你是不是忘了点什么，比如花呗？
                  </span>
              </a>
            </li>
            <li>
              <a href="#">
                <span class="photo"><img alt="avatar" src="list/img/003.jpg"></span>
                <span class="subject">
                  <span class="from">马化腾</span>
                  <span class="time">40 mins.</span>
                  </span>
                <span class="message">
                  听说你公司需要一笔资金，聊聊？
                  </span>
              </a>
            </li>
            <li>
              <a href="#">
                <span class="photo"><img alt="avatar" src="list/img/004.jpg"></span>
                <span class="subject">
                  <span class="from">刘德华</span>
                  <span class="time">2 hrs.</span>
                  </span>
                <span class="message">
                  今晚工体，私人飞机晚上八点到</br>武宿接你！！！
                  </span>
              </a>
            </li>
            <li>
              <a href="#">
                <span class="photo"><img alt="avatar" src="list/img/005.jpg"></span>
                <span class="subject">
                  <span class="from">王健林</span>
                  <span class="time">4 hrs.</span>
                  </span>
                <span class="message">
                  老弟，不是哥不帮你，我也困难</br>呀，去年你又不是不知道
                  </span>
              </a>
            </li>
            <li>
              <a href="#">See all messages</a>
            </li>
          </ul>
        </li>
        <!-- inbox dropdown end -->
        <!-- notification dropdown start-->
        <li id="header_notification_bar" class="dropdown">
          <a data-toggle="dropdown" class="dropdown-toggle" href="#">
            <i class="fa fa-bell-o"></i>
            <span class="badge bg-warning">7</span>
          </a>
          <ul class="dropdown-menu extended notification">
            <div class="notify-arrow notify-arrow-yellow"></div>
            <li>
              <p class="yellow">您有7条新的通知</p>
            </li>
            <li>
              <a href="#">
                <span class="label label-danger"><i class="fa fa-bolt"></i></span>
                服务器超载.
                <span class="small italic">4 mins.</span>
              </a>
            </li>
            <li>
              <a href="#">
                <span class="label label-warning"><i class="fa fa-bell"></i></span>
               编号8081没有反应
                <span class="small italic">30 mins.</span>
              </a>
            </li>
            <li>
              <a href="#">
                <span class="label label-danger"><i class="fa fa-bolt"></i></span>
                磁盘剩余空间 85%.
                <span class="small italic">2 hrs.</span>
              </a>
            </li>
            <li>
              <a href="#">
                <span class="label label-success"><i class="fa fa-plus"></i></span>
                有3个新用户注册.
                <span class="small italic">3 hrs.</span>
              </a>
            </li>
            <li>
              <a href="#">查看所有通知</a>
            </li>
          </ul>
        </li>
        <!-- notification dropdown end -->
      </ul>
      <!--  notification end -->
    </div>
    <div class="top-menu">
      <ul class="nav pull-right top-menu">
        <li><a class="logout" href="login.html">Logout</a></li>
      </ul>
    </div>
  </header>
  <!--header end-->
  <!-- **********************************************************************************************************************************************************
      MAIN SIDEBAR MENU
      *********************************************************************************************************************************************************** -->
  <!--sidebar start-->
  <aside>
    <div id="sidebar" class="nav-collapse ">
      <!-- sidebar menu start-->
      <ul class="sidebar-menu" id="nav-accordion">
        <p class="centered"><a href="#"><img src="list/img/001.jpg" class="img-circle" width="80"></a></p>
        <h5 class="centered">Tom</h5>
        <li class="mt">
          <a class="active" href="doIndexUI">
            <i class="fa fa-dashboard"></i>
            <span>首页</span>
          </a>
        </li>
        <li class="sub-menu">
          <a href="#">
            <i class="fa fa-tasks"></i>
            <span>商品管理</span>
          </a>
          <ul class="sub">
            <li><a href="">商品分类</a></li>
            <li><a href="">商品查询</a></li>
            <li><a href="">商品添加</a></li>
          </ul>
        </li>
        <li class="sub-menu">
          <a href="#">
            <i class="fa fa-th"></i>
            <span>订单管理</span>
          </a>
          <ul class="sub">
            <li><a id="load-order-id">订单详情列表</a></li>
            <li><a id="load-sale-id">售后处理查询</a></li>
            <li><a id="load-reason-id">售后系统设置</a></li>
          </ul>
        </li>
        <li class="sub-menu">
          <a href="#">
            <i class="fa fa-cogs"></i>
            <span>系统管理</span>
          </a>
          <ul class="sub">
            <li><a id="load-menu-id">菜单管理</a></li>
            <li><a id="load-role-id">角色管理</a></li>
            <li><a id="load-dept-id">部门管理</a></li>
            <li><a id="load-user-id">用户管理</a></li>
            <li><a id="load-log-id">日志列表</a></li>
            <li><a id="load-pwd-id">密码修改</a></li>
          </ul>
        </li>
      </ul>
      <!-- sidebar menu end-->
    </div>
  </aside>
  <!--sidebar end-->
  <!-- **********************************************************************************************************************************************************
      MAIN CONTENT
      *********************************************************************************************************************************************************** -->
  main content start
  <section id="main-content">
    <section class="wrapper">
<!--      <ol class="breadcrumb">-->
<!--        <li><a href="#"><i class="fa fa-dashboard"></i> Level</a></li>-->
<!--        <li class="active">Here</li>-->
<!--      </ol>-->
      <!-- /row -->
    </section>
    <section id="mainContentId" class="content container-fluid">

      <!-- 天气 -->
      <div class="col-lg-4 col-md-4 col-sm-4 mb">
        <div class="weather-2 pn">
          <div class="weather-2-header">
            <div class="row">
              <div class="col-sm-6 col-xs-6">
                <p>太原</p>
              </div>
              <div class="col-sm-6 col-xs-6 goright">
                <p class="small">Thu Apr 14, 2014</p>
              </div>
            </div>
          </div>
          <!-- /weather-2 header -->
          <div class="row centered">
            <img src="list/img/ny.jpg" class="list/img-circle" width="120">
          </div>
          <div class="row data">
            <div class="col-sm-6 col-xs-6 goleft">
              <h4><b>16 ºC</b></h4>
              <h6>21º max</h6>
              <h6>8º min</h6>
            </div>
            <div class="col-sm-6 col-xs-6 goright">
              <h5><i class="fa fa-sun-o fa-2x"></i></h5>
              <h6><b>Sunny</b></h6>
              <h5>7:15 am</h5>
            </div>
          </div>
        </div>
      </div>
    </section>
  </section>
</section>
<!-- js placed at the end of the document so the pages load faster -->
<script src="list/lib/jquery/jquery.min.js"></script>

<script src="list/lib/bootstrap/js/bootstrap.min.js"></script>
<script class="include" type="text/javascript" src="list/lib/jquery.dcjqaccordion.2.7.js"></script>
<script src="list/lib/jquery.scrollTo.min.js"></script>
<script src="list/lib/jquery.nicescroll.js" type="text/javascript"></script>
<script src="list/lib/jquery.sparkline.js"></script>
<!--common script for all pages-->
<script src="list/lib/common-scripts.js"></script>
<script type="text/javascript" src="list/lib/gritter/js/jquery.gritter.js"></script>
<script type="text/javascript" src="list/lib/gritter-conf.js"></script>
<!--script for this page-->
<script src="list/lib/sparkline-chart.js"></script>
<script src="list/lib/zabuto_calendar.js"></script>
<script type="text/javascript">
  $(document).ready(function() {
    var unique_id = $.gritter.add({
      // (string | mandatory) the heading of the notification
      title: '欢迎登陆',
      // (string | mandatory) the text inside the notification
      text: '您有新的消息，请注意及时查看处理',
      // (string | optional) the image to display on the left
      image: 'list/img/001.jpg',
      // (bool | optional) if you want it to fade out on its own or just sit there
      sticky: false,
      // (int | optional) the time you want it to be alive for before fading out
      time: 8000,
      // (string | optional) the class name you want to apply to that specific message
      class_name: 'my-sticky-class'
    });

    return false;
  });
  $(function(){//jquery中的函数,页面加载完成以后执行
    doLoadUI("load--id","");//商品分类
    doLoadUI("load--id","");// 商品查询
    doLoadUI("load--id","");// 商品添加

    doLoadUI("load-order-id","order/order_list");//订单详情列表
    doLoadUI("load-sale-id","sale/sale_list");//售后处理查询
    doLoadUI("load-reason-id","reason/reason_list");//售后系统设置

    doLoadUI("load-menu-id","/menu/menu_list");//菜单管理
    doLoadUI("load-role-id","/log/role_list");//角色管理
    doLoadUI("load-dept-id","/dept/dept_list");//部门管理
    doLoadUI("load-user-id","/user/user_list");//用户管理
    doLoadUI("load-log-id","/log/log_list");//日志管理
    doLoadUI("load-pwd-id","/user/pwd_edit");//密码管理
  })
  function doLoadUI(id,url){
    $("#"+id).click(function(){
      $("#mainContentId").load(url,()=>{
        $("#mainContentId").removeData();//移出所有通过data函数绑定的数据
      });
    })
  }
</script>
<script type="application/javascript">
  $(document).ready(function() {
    $("#date-popover").popover({
      html: true,
      trigger: "manual"
    });
    $("#date-popover").hide();
    $("#date-popover").click(function(e) {
      $(this).hide();
    });

    $("#my-calendar").zabuto_calendar({
      action: function() {
        return myDateFunction(this.id, false);
      },
      action_nav: function() {
        return myNavFunction(this.id);
      },
      ajax: {
        url: "show_data.php?action=1",
        modal: true
      },
      legend: [{
        type: "text",
        label: "Special event",
        badge: "00"
      },
        {
          type: "block",
          label: "Regular event",
        }
      ]
    });
  });

  function myNavFunction(id) {
    $("#date-popover").hide();
    var nav = $("#" + id).data("navigation");
    var to = $("#" + id).data("to");
    console.log('nav ' + nav + ' to: ' + to.month + '/' + to.year);
  }
</script>
</body>

</html>
